import { BrowserRouter,Route } from 'react-router-dom'
import Index from './pages/Index/index'
import Login from './pages/Login/login'
import Visit from "./pages/visit";
import Admin from "./pages/admin";
import {createContext, useState} from "react";
import {BackTop} from "antd";
import {ArrowUpOutlined} from "@ant-design/icons";
export const RoleContext = createContext({role:"",setRole:()=>{}});
const style = {
    height: 40,
    width: 40,
    lineHeight: '40px',
    borderRadius: 4,
    backgroundColor: '#1088e9',
    color: '#fff',
    textAlign: 'center',
    fontSize: 14,
};
function App() {
    const [role,setRole] =useState('user')
    return (
        <RoleContext.Provider value={{role,setRole}}>
         <BrowserRouter>
            <div className='App'>
                <Route exact path={"/"} component={Visit}/>
                <Route path="/index" component={Index}/>
                <Route path="/login" component={Login} />
                <Route path={"/visit"} component={Visit}/>
                <Route path={'/admin'} component={Admin}/>
            </div>
         </BrowserRouter>
            <BackTop>
                <div style={style}><ArrowUpOutlined /></div>
            </BackTop>
        </RoleContext.Provider>
  );
}

export default App;
